import 'package:easy_read_comic/controller/index/index_controller.dart';
import 'package:easy_read_comic/internal/api/navigate_api.dart';
import 'package:easy_read_comic/view/comic/search_list_view.dart';
import 'package:easy_read_comic/view/index/index_list_view.dart';
import 'package:easy_read_comic/widgets/search_widget.dart';
import 'package:easy_read_comic/widgets/swiper_widget.dart';
import 'package:easy_read_comic/widgets/tag_widget.dart';
import 'package:dio/src/response.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart' as G;

import '../../models/navigate_model.dart';

class IndexView extends StatefulWidget {
  List<NavigateModel> list = [];

  @override
  State<StatefulWidget> createState() => _IndexView();
}

class _IndexView extends State<IndexView> with TickerProviderStateMixin {
  late TabController _tabController =
      TabController(length: widget.list.length, vsync: this);

  @override
  void initState() {
    super.initState();
    this.getNavigateList().then((response) {
      if (response.data["code"] == 1) {
        widget.list = [];
        for (var item in response.data["data"]) {
          widget.list.add(NavigateModel.formJson(item));
        }
        setState(() {
          _tabController = TabController(
            length: widget.list.length,
            vsync: this,
          );
        });
      }
    });
  }

  @override
  void dispose() {
    _tabController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return G.GetBuilder(
      builder: (controller) {
        return Container(
          child: Column(
            children: [
              Container(
                child: Padding(
                  padding: EdgeInsets.only(
                    left: 20,
                    right: 20,
                  ),
                  child: SearchWidget(
                    controller.hotSearch.length > 0
                        ? controller.hotSearch.first
                        : "输入搜索内容...",
                    onSubmitted: (value) {
                      if (value.isEmpty) {
                        value = controller.hotSearch.first;
                      }
                      G.Get.toNamed('/search', arguments: {
                        "keyword": value,
                      });
                    },
                  ),
                ),
                color: Theme.of(context).primaryColor,
              ),
              //热门搜索
              Container(
                padding: EdgeInsets.only(
                  left: 20,
                  right: 20,
                ),
                color: Theme.of(context).primaryColor,
                child: Row(
                  children: controller.hotSearch
                      .map(
                        (e) => TagWidget(
                          e.toString(),
                          onTap: () {
                            G.Get.toNamed('/search', arguments: {
                              "keyword": e.toString(),
                            });
                          },
                        ),
                      )
                      .toList(),
                ),
              ),
              Stack(
                children: [
                  Container(
                    color: Theme.of(context).primaryColor,
                    width: G.Get.width,
                    height: 170,
                  ),
                  Container(
                    child: SwiperWidget(
                      G.Get.width,
                      200,
                      allPadding: 20,
                    ),
                  )
                ],
              ),
              Container(
                child: TabBar(
                  isScrollable: true,
                  labelPadding: EdgeInsets.only(
                    right: 10,
                    left: 10,
                    bottom: 0,
                  ),
                  tabAlignment: TabAlignment.start,
                  labelColor: Theme.of(context).primaryColor,
                  labelStyle: TextStyle(
                    fontSize: 18,
                  ),
                  indicator: UnderlineTabIndicator(
                    // 横线指示器
                    borderSide: BorderSide(
                      width: 2,
                      color: Theme.of(context).primaryColor,
                    ),
                  ),
                  controller: _tabController,
                  tabs: widget.list.map((e) => Tab(text: e.Title)).toList(),
                ),
                width: G.Get.width,
              ),
              Expanded(
                child: Container(
                  child: TabBarView(
                    controller: _tabController,
                    children: widget.list
                        .map(
                          (e) => IndexListView(
                            e,
                            key: PageStorageKey(e.Id.toString()),
                          ),
                        )
                        .toList(),
                  ),
                  padding: EdgeInsets.all(15),
                ),
              ),
            ],
          ),
        );
      },
      init: IndexController(),
    );
  }

  // getNavigateList 获取首页导航
  Future<Response> getNavigateList() async {
    return NavigateApi().navigate();
  }
}
